<template>
  <j-modal
    :title="title"
    :width="width"
    :visible="visible"
    :maskClosable="false"
    switchFullscreen
    @ok="handleOk"
    :okButtonProps="{ class:{'jee-hidden': disableSubmit} }"
    @cancel="handleCancel">
    <a-card :bordered="false">
      <j-form-container>
        <a-form-model v-if="model.code=='separate_host'" ref="form" :model="model" :rules="validatorRules" slot="detail">
          <a-row>
            <a-col :span="24" >
              <a-form-model-item label="分户原因" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="name">
                <a-input v-model="model.reason" placeholder="请输入分户原因" ></a-input>
              </a-form-model-item>
            </a-col>
          </a-row>
        </a-form-model>
      </j-form-container>
      <a-table
        ref="table"
        size="middle"
        :scroll="{x:true}"
        bordered
        rowKey="id"
        :columns="columns"
        :dataSource="dataSource"
        :loading="loading"
        :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
        class="j-table-force-nowrap">
<!--          <span slot="action" slot-scope="text, record">
             <a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
                 <a>删除</a>
             </a-popconfirm>
          </span>-->
      </a-table>
    </a-card>
  </j-modal>
</template>

<script>


  import { JeecgListMixin } from '@/mixins/JeecgListMixin'
  import { mixinDevice } from '@/utils/mixin'

  export default {
    name: 'VcaSelectResidentModal',
    mixins:[JeecgListMixin, mixinDevice],
    data() {
      return {
        model:{},
        columns: [
          {
            title:'姓名',
            align:"center",
            dataIndex: 'residentName'
          },{
            title:'身份证',
            align:"center",
            dataIndex: 'idcard'
          },{
            title:'与户主关系',
            align:"center",
            dataIndex: 'familyRelation'
          }
        ],
        labelCol: {
          xs: { span: 24 },
          sm: { span: 5 },
        },
        wrapperCol: {
          xs: { span: 24 },
          sm: { span: 16 },
        },
        title:'',
        width:600,
        visible: false,
        disableMixinCreated:true,
        disableSubmit: false,
        url: {
          list: "/villageCadreAssist/vcaResident/list"
        },
      }
    },
    methods:{
      init(record){
        this.model = Object.assign({},record);
        this.model.reason = "家庭人口多";
        this.dataSource=[];
        record["familyList"].push(record["resident"]);
        record["familyList"].forEach(item=>{this.dataSource.push(item);});
        this.visible=true;
      },
      close () {
        this.$emit('close');
        this.visible = false;
      },
      submitCallback(){
        this.$emit('ok');
        this.visible = false;
      },
      handleCancel () {
        this.close()
      },
      onSelectChange(selectedRowKeys, selectionRows) {
        if(this.model["code"]=="cancel_pension" || !selectionRows.some(item=>item["familyRelation"]=="户主")){
          this.selectedRowKeys = selectedRowKeys;
          this.selectionRows = selectionRows;
        }
      },
      handleOk(){
        fullParamData(this.selectionRows,this.model);
        this.visible = false;
      }
    }
  }
</script>

<style scoped>
</style>